<!--
 * @Description: 
 * @Version: 1.0
 * @Autor: sun
 * @Date: 2022-03-14 23:12:24
-->
<template>
  <div class="home-container container">
    <img src="@/assets/imgs/pic/4.png" class="article-pic" />
    <p
      class="hot"
      @click="jump(item.type, item)"
      v-for="(item, index) in data"
      :key="index"
    ></p>
    <aside v-if="current && current.type != 3">
      <section class="box">
        <span class="text" v-if="current.text">{{ current.text }}</span>
        <img
          :src="current.img"
          class="wx-img"
          v-if="current.img"
          style="    max-height: 4.6rem;"
        />
        <span class="closeBtn" @click="closeFn()"></span>
      </section>
    </aside>
  </div>
</template>

<script>
export default {
  data() {
    return {
      current: null,
      data: [
        {
          type: 3,
          url:
            'https://market.m.taobao.com/app/tb-source-app/shopact/pages/index?wh_weex=true&pathInfo=shop/activity&userId=61744522&shopId=35039020&pageId=341222506&alisite=true',
        },
        { type: 3, url: 'weixin://dl/business/?t=dLeFThW4yBa' },

        {
          type: 3,
          url:
            'https://pro.m.jd.com/mall/active/3rBPmyLtmofSZusB4PkeYdV65iN7/index.html',
        },
        {
          type: 3,
          url:
            'https://shop41176557.m.youzan.com/v2/feature/GnCyFU6WRi?shopAutoEnter=1&kdt_id=40984389',
        },

        { type: 2, img: require('../../assets/imgs/图片1.png') },

        {
          type: 3,
          url: 'https://mo.m.tmall.com/page/4587455?shop_id=152303815',
        },
        {
          type: 3,
          url: 'https://x.eqxiu.com/s/1jEYnt7z',
        },
        {
          type: 3,
          url: 'https://contents.ctrip.com/activitysetupapp/mkt/index/cdwgj',
        },
        {
          type: 3,
          url: 'https://ppg.viviv.com/doodle/MbqApagF.html?hyId=jimu_MbqApagF',
        },
        { type: 2, img: require('../../assets/imgs/图片2.png') },
        {
          type: 3,
          url:
            'https://pro.m.jd.com/mall/active/aR867ENZvvSbPs6pu1dr8VGp9ik/index.html',
        },
      ],
    };
  },
  methods: {},
  mounted() {},
  methods: {
    jump(type, item) {
      this.current = item;
      if (type != 3) {
        return;
      }
      location.href = item.url;
    },
    closeFn() {
      this.current = null;
    },
  },
};
</script>

<style lang="scss" scoped>
.container {
  margin-bottom: 100px;
  position: relative;
  p.hot {
    width: 90%;
    left: 5%;
    height: 5.1rem;
    position: absolute;
    z-index: 1;
    top: 10rem;
    &:nth-child(3) {
      top: 16.6rem;
    }
    &:nth-child(4) {
      top: 22.5rem;
    }
    &:nth-child(5) {
      top: 28.6rem;
    }
    &:nth-child(6) {
      top: 36.2rem;
    }
    &:nth-child(7) {
      top: 42.3rem;
    }
    &:nth-child(8) {
      top: 48.3rem;
    }
    &:nth-child(9) {
      top: 55.3rem;
    }
    &:nth-child(10) {
      top: 61.3rem;
    }
    &:nth-child(11) {
      top: 68.3rem;
    }
    &:nth-child(12) {
      top: 74.97rem;
    }
  }
}
</style>
